<template>
  <div class="setting">
    <div class="edit">
    <el-form label-width="120px" style="width:40%">
      <el-form-item label="原密码" prop="nickName">
        <el-input v-model="oldPassword" placeholder="请输入" show-password></el-input>
      </el-form-item>
      <el-form-item label="新密码" prop="phonenumber">
        <el-input v-model="password" placeholder="请输入" show-password></el-input>
      </el-form-item>
      <el-form-item label="再次输入密码" prop="phonenumber">
        <el-input v-model="newPassword" placeholder="请输入" show-password></el-input>
      </el-form-item>
    </el-form>
    </div>
    <div class="submit">
      <el-button type="primary" @click="submit">保存修改</el-button>
    </div>
  </div>
</template>

<script>
import { changePassword } from "@/api/common";
export default {
  data(){
    return{
      oldPassword:'',
      password:'',
      newPassword:''
    }
  },
  methods:{
    submit(){
      if(!this.oldPassword){
        this.$message.warning('请输入原密码')
        return 
      }
      if(!this.password){
        this.$message.warning('请输入新密码')
        return 
      }
      if(!this.newPassword){
        this.$message.warning('请再次输入密码')
        return 
      }
      if(this.oldPassword == this.password){
        this.$message.warning('新密码不能与原密码相同')
        return 
      }
      if(this.password !== this.newPassword){
        this.$message.warning('两次输入的密码不一致')
        return 
      }
      let req = {
        oldPassword:this.oldPassword,
        newPassword:this.newPassword
      }
      changePassword(req).then(res=>{
        console.log(res);
        if(res.code == 200){
          this.$message.success('修改成功')
          this.oldPassword = ''
          this.password = ''
          this.newPassword = ''
        }
      })
    }
  }
}
</script>

<style scoped>
.edit{
  background-color: #fff;
  padding: 40px 20px;
}
.submit{
  padding: 20px;
  text-align: center;
}
</style>